<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <!--头部固定引用-->
  <meta charset="utf-8">
  <meta name="full-screen" content="yes">
  <meta name="x5-fullscreen" content="true">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
  <link rel="stylesheet" href="../../css/base.css">
  <!--固定引用结束,自定义引用添加在下面-->
  <title>下载</title>
  <!--页面样式添加在这里，多看看base。css里面的公共样式，大部分常用的都有，避免使用独立css文件为单独页面设置样式，避免随意添加样式到公共样式-->
  <style>
      body,html{
          height: 100%;
          width: 100%;
          background: #fff;
      }
      .imgbox {
          width: 7.5rem;
          height: 16.24rem;
          background-image: url(../../images/allPic/zhengzhangtu.png);
          background-size: cover;
          position: relative;
      }
      .erweima {
        width: 3.1rem;
        height: 3.1rem;
        position: absolute;
        top: 7.88rem;
        left: 50%;
        transform: translateX(-50%);
      }
      .downloadbox {
          display: flex;
          width: 100%;
          position: absolute;
          left: 50%;
          bottom: 15%;
          transform: translate(-50%,50%);
      }
      .flexBox {
        flex: 1;
        height: 0.96rem;
        position: relative;
      }
      .anzhuo {    
        width: 3.1rem;
        height: 0.96rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
      }
      .ios {
        width:3.1rem;
        height: 0.96rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
      }
  </style>
</head>
<!--尽量不要在body上添加样式，除了背景色-->
<body>
<div>
  <!--具体代码-->
  <div class="imgbox">
    <img src="../../images/allPic/ceshierweima.png" alt="" class="erweima">
    <div class="downloadbox">
        <div class="flexBox">
          <img src="../../images/allPic/anzhuo.png" alt="" class="anzhuo" data-key='anzhuo' onclick="download(this)">
        </div>
        <div class="flexBox">
          <img src="../../images/allPic/IOS.png" alt="" class="ios" data-key='ios' onclick="download(this)">
        </div>
    </div>
  </div>
</div>
<a href="" style="display: none;" id='anzhuo'></a>
<a href="" style="display: none;" id='ios'></a>
</body>
<!--下面五个文件为固定引用，自己根据情况调整路径，不要跟换引入顺序，其他引用添加在后面-->
<script src="../../js/dict.js"></script>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/checkJsBridge.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../js/api.js"></script>
<!--固定引用结束-->
<!--避免一个页面包含过多功能，减少js重绘页面，推荐分功能，分页面-->
<script>
  let ua
  /*固定页面初始化方法，用于替代$(function(){}),param为url参数，Object类型*/
  function initPage(params) {
    ua = navigator.userAgent.toLowerCase();//获取判断用的对象
    // console.log(ua)
    getanzhuo()
    getios()
  }

  /*页面所在窗口由后台前台时触发的方法,param为url参数，Object类型*/
  function startPage(params) {

  }

  function reLoadPage() {

  }
  //下载
  function download(params){
    let mark = $(params).attr('data-key')
    console.log(mark)
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
                //在微信中打开
      jsBridge.toast('请点击右上角按钮，然后在弹出菜单中点击“浏览器打开”，即可安装')
    }else{
      if(mark === 'anzhuo'){
        $('#anzhuo')[0].click()
      }else if(mark === 'ios'){
        $('#ios')[0].click()
      }
    }
  }
  //获取最新的两个版本
  function getanzhuo(){
    Server.getVersion.getnewversion({'appType':'1','versionNo':1}).then(res => {
      console.log(res,'anzhuo')
      if(res.data.code === '1'){
        $('#anzhuo').attr('href',res.data.result.updateAddr)
      }
    })
  }
  function getios(){
    Server.getVersion.getnewversion({'appType':'2','versionNo':1}).then(res => {
      console.log(res,'ios')
      if(res.data.code === '1'){
        $('#ios').attr('href',res.data.result.updateAddr)
      }
    })
  }
</script>
</html>